<template>
  <div class="text">
    <!--
    <svg class="icon" aria-hidden="true">
      <use :xlink:href="iconFont"></use>
    </svg>
    -->
    <span :class="icons"></span>
    {{text}}
  </div>
</template>

<script>
  export default {
    name     : 'icon',
    props    : [
      'code',
      'text'
    ],
    computed : {
      icons(){
        return 'icon iconfont icon-'+this.code
      },
      iconFont(){
        return '#icon-'+this.code;
      }
    }
  }
</script>

<style scoped>
.icon{
  margin-right:4px;
  font-size: 20px;
  vertical-align:-18%;
}
</style>